<!DOCTYPE html>
<html lang=zh-CN>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="google-site-verification" content="xBT4GhYoi5qRD5tr338pgPM5OWHHIDR6mNg1a3euekI" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta property="og:description" content="samuel-24276的博客">
    <meta property="og:type" content="website">
    <meta name="description" content="samuel-24276的博客">
    <meta name="keyword"  content="aircloud">
    <link rel="shortcut icon" href="/myblog/img/favicon.ico">

    <title>
        
        QT案例——翻金币游戏 - samuel-24276的博客 | samuel-24276&#39;s Blog
        
    </title>

    <!-- Custom CSS -->
    
<link rel="stylesheet" href="/myblog/css/aircloud.css">

    
<link rel="stylesheet" href="/myblog/css/gitment.css">

    <!--<link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css">-->
    <link href="//at.alicdn.com/t/font_620856_28hi1hpxx24.css" rel="stylesheet" type="text/css">
    <!-- ga & ba script hoook -->
    <script></script>
<meta name="generator" content="Hexo 7.1.1"></head>

<body>

<div class="site-nav-toggle" id="site-nav-toggle">
    <button>
        <span class="btn-bar"></span>
        <span class="btn-bar"></span>
        <span class="btn-bar"></span>
    </button>
</div>

<div class="index-about">
    <i> Like what you do, do what you like </i>
</div>

<div class="index-container">
    
    <div class="index-left">
        
<div class="nav" id="nav">
    <div class="avatar-name">
        <div class="avatar ">
            <img src="/myblog/img/avatar.jpg" />
        </div>
        <div class="name">
            <i>samuel-24276</i>
        </div>
    </div>
    <div class="contents" id="nav-content">
        <ul>
            <li >
                <a href="/myblog/">
                    <i class="iconfont icon-shouye1"></i>
                    <span>主页</span>
                </a>
            </li>
            <li >
                <a href="/myblog/tags">
                    <i class="iconfont icon-biaoqian1"></i>
                    <span>标签</span>
                </a>
            </li>
            <li >
                <a href="/myblog/archives">
                    <i class="iconfont icon-guidang2"></i>
                    <span>存档</span>
                </a>
            </li>
            <li >
                <a href="/myblog/collect/">
                    <i class="iconfont icon-shoucang1"></i>
                    <span>收藏</span>
                </a>
            </li>
            <li >
                <a href="/myblog/about/">
                    <i class="iconfont icon-guanyu2"></i>
                    <span>关于</span>
                </a>
            </li>
            
            <li>
                <a id="search">
                    <i class="iconfont icon-sousuo1"></i>
                    <span>搜索</span>
                </a>
            </li>
            
        </ul>
    </div>
    
        <div id="toc" class="toc-article">
    <ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#1-%E4%B8%BB%E5%9C%BA%E6%99%AF%E6%90%AD%E5%BB%BA"><span class="toc-text">1.主场景搭建</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#2-%E8%87%AA%E5%AE%9A%E4%B9%89%E6%8C%89%E9%92%AE%E7%B1%BB%E7%9A%84%E5%B0%81%E8%A3%85%E5%92%8C%E5%BC%80%E5%A7%8B%E6%8C%89%E9%92%AE%E7%9A%84%E7%89%B9%E6%95%88%E5%AE%9E%E7%8E%B0"><span class="toc-text">2.自定义按钮类的封装和开始按钮的特效实现</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#2-1-%E8%87%AA%E5%AE%9A%E4%B9%89%E6%8C%89%E9%92%AE%E7%B1%BB%E7%9A%84%E5%B0%81%E8%A3%85"><span class="toc-text">2.1.自定义按钮类的封装</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#2-2-%E5%BC%80%E5%A7%8B%E6%8C%89%E9%92%AE%E7%9A%84%E7%89%B9%E6%95%88%E5%AE%9E%E7%8E%B0"><span class="toc-text">2.2.开始按钮的特效实现</span></a></li></ol></li><li class="toc-item toc-level-1"><a class="toc-link" href="#3-%E9%80%89%E5%85%B3%E5%9C%BA%E6%99%AF"><span class="toc-text">3.选关场景</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#3-1-%E5%9F%BA%E6%9C%AC%E9%85%8D%E7%BD%AE"><span class="toc-text">3.1.基本配置</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#3-2-%E8%BF%94%E5%9B%9E%E6%8C%89%E9%92%AE%E5%AE%9E%E7%8E%B0"><span class="toc-text">3.2.返回按钮实现</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#3-3-%E6%8C%89%E9%92%AE%E7%9A%84%E5%85%B7%E4%BD%93%E5%AE%9E%E7%8E%B0"><span class="toc-text">3.3.按钮的具体实现</span></a></li></ol></li><li class="toc-item toc-level-1"><a class="toc-link" href="#4-%E6%B8%B8%E6%88%8F%E5%9C%BA%E6%99%AF%E7%9A%84%E6%90%AD%E5%BB%BA"><span class="toc-text">4.游戏场景的搭建</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#4-1%E5%9C%BA%E6%99%AF%E5%BC%B9%E5%87%BA"><span class="toc-text">4.1场景弹出</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#4-2-%E5%9C%BA%E6%99%AF%E6%90%AD%E5%BB%BA"><span class="toc-text">4.2.场景搭建</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#4-3-%E9%87%91%E5%B8%81%E7%B1%BB%E7%9A%84%E5%B0%81%E8%A3%85%E4%B8%8E%E9%87%91%E5%B8%81%E7%BF%BB%E8%BD%AC%E7%9A%84%E5%AE%9E%E7%8E%B0"><span class="toc-text">4.3.金币类的封装与金币翻转的实现</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#4-4-%E5%9C%BA%E6%99%AF%E5%88%87%E6%8D%A2%E7%9A%84%E4%BC%98%E5%8C%96"><span class="toc-text">4.4.场景切换的优化</span></a></li></ol></li><li class="toc-item toc-level-1"><a class="toc-link" href="#5-%E6%A3%80%E6%B5%8B%E8%83%9C%E5%88%A9"><span class="toc-text">5.检测胜利</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#5-1-%E8%83%9C%E5%88%A9%E6%A3%80%E6%B5%8B"><span class="toc-text">5.1.胜利检测</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#5-2-%E8%83%9C%E5%88%A9%E7%9A%84%E6%93%8D%E4%BD%9C"><span class="toc-text">5.2.胜利的操作</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#5-3-Bug%E8%A7%A3%E5%86%B3"><span class="toc-text">5.3.Bug解决</span></a></li></ol></li><li class="toc-item toc-level-1"><a class="toc-link" href="#6-%E9%9F%B3%E6%95%88%E6%B7%BB%E5%8A%A0"><span class="toc-text">6.音效添加</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#6-1-%E5%BC%80%E5%A7%8B%E6%8C%89%E9%92%AE%E9%9F%B3%E6%95%88"><span class="toc-text">6.1.开始按钮音效</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#6-2-%E9%80%89%E6%8B%A9%E6%8C%89%E9%92%AE%E9%9F%B3%E6%95%88"><span class="toc-text">6.2.选择按钮音效</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#6-3-%E8%BF%94%E5%9B%9E%E6%8C%89%E9%92%AE%E9%9F%B3%E6%95%88"><span class="toc-text">6.3.返回按钮音效</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#6-4-%E7%BF%BB%E9%87%91%E5%B8%81%E9%9F%B3%E6%95%88"><span class="toc-text">6.4.翻金币音效</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#6-5-%E6%B8%B8%E6%88%8F%E8%83%9C%E5%88%A9%E9%9F%B3%E6%95%88"><span class="toc-text">6.5.游戏胜利音效</span></a></li></ol></li><li class="toc-item toc-level-1"><a class="toc-link" href="#7-%E6%80%9D%E8%B7%AF%E6%80%BB%E7%BB%93"><span class="toc-text">7.思路总结</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#7-1-%E5%88%9B%E5%BB%BA%E4%B8%BB%E5%9C%BA%E6%99%AF"><span class="toc-text">7.1.创建主场景</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#7-2-%E8%87%AA%E5%AE%9A%E4%B9%89%E6%8C%89%E9%92%AE%E7%B1%BB"><span class="toc-text">7.2.自定义按钮类</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#7-3-%E9%80%89%E5%85%B3%E5%9C%BA%E6%99%AF"><span class="toc-text">7.3.选关场景</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#7-4-%E6%B8%B8%E6%88%8F%E5%9C%BA%E6%99%AF"><span class="toc-text">7.4.游戏场景</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#7-5-%E6%A3%80%E6%B5%8B%E6%B8%B8%E6%88%8F%E8%83%9C%E5%88%A9"><span class="toc-text">7.5.检测游戏胜利</span></a></li></ol></li></ol>
</div>
    
</div>


<div class="search-field" id="search-field">
    <div class="search-bg" id="search-bg"></div>
    <div class="search-container">
        <div class="search-input">
            <span id="esc-search"> <i class="icon-fanhui iconfont"></i></span>
            <input id="search-input"/>
            <span id="begin-search">搜索</span>
        </div>
        <div class="search-result-container" id="search-result-container">

        </div>
    </div>
</div>

        <div class="index-about-mobile">
            <i> Like what you do, do what you like </i>
        </div>
    </div>
    
    <div class="index-middle">
        <!-- Main Content -->
        


<div class="post-container">
    <div class="post-title">
        QT案例——翻金币游戏
    </div>

    <div class="post-meta">
        <span class="attr">发布于：<span>2019-12-16 20:15:38</span></span>
        
        <span class="attr">标签：/
        
        <a class="tag" href="/myblog/tags/#Qt" title="Qt">Qt</a>
        <span>/</span>
        
        
        </span>
        <span class="attr">访问：<span id="busuanzi_value_page_pv"></span>
</span>
</span>
    </div>
    <div class="post-content no-indent">
        <h1 id="1-主场景搭建"><a href="#1-主场景搭建" class="headerlink" title="1.主场景搭建"></a>1.主场景搭建</h1><p>建立一个QMainWindow窗口，命名为mainScene,在mainscene.cpp里加入头文件<code>#include&lt;QPainter&gt;</code>用于绘图，在mainscene.ui里的menuBar创建两个action开始和退出，删除mainToolBar和statusBar，在mainscen.cpp的构造函数里添加如下代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//点击开始-&gt;退出，退出游戏</span></span><br><span class="line"><span class="built_in">connect</span>(ui-&gt;actionquit, &amp;QAction::triggered, [=]()&#123;</span><br><span class="line">	<span class="keyword">this</span>-&gt;<span class="built_in">close</span>();</span><br><span class="line">&#125;);</span><br><span class="line"><span class="comment">//设置固定大小</span></span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(<span class="number">320</span>, <span class="number">600</span>);</span><br><span class="line"><span class="comment">//设置标题</span></span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setWindowTitle</span>(<span class="string">&quot;翻金币&quot;</span>);</span><br><span class="line"><span class="comment">//设置窗口图标</span></span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setWindowIcon</span>(<span class="built_in">QIcon</span>(<span class="string">&quot;:/res/img/Coin0001.png&quot;</span>));</span><br></pre></td></tr></table></figure>
<p>为了给窗口添加背景图片，我们选择绘图事件，在mainscene.h里声明函数：<code>void paintEvent(QPaintEvent *);</code>,在mainscene.cpp里对其进行实现：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="type">void</span> <span class="title">MainScene::paintEvent</span><span class="params">(QPaintEvent *)</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    <span class="function">QPainter <span class="title">painter</span><span class="params">(<span class="keyword">this</span>)</span></span>;</span><br><span class="line">    QPixmap pix;</span><br><span class="line">    pix.<span class="built_in">load</span>(<span class="string">&quot;:/res/img/PlayLevelSceneBg.png&quot;</span>);</span><br><span class="line">    <span class="comment">//根据窗口宽高拉伸图片</span></span><br><span class="line">    painter.<span class="built_in">drawPixmap</span>(<span class="number">0</span> ,<span class="number">0</span>, <span class="keyword">this</span>-&gt;<span class="built_in">width</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">height</span>(), pix);</span><br><span class="line"></span><br><span class="line">    <span class="comment">//添加标题图片</span></span><br><span class="line">    pix.<span class="built_in">load</span>(<span class="string">&quot;:/res/img/Title.png&quot;</span>);</span><br><span class="line">    <span class="comment">//更改图片大小</span></span><br><span class="line">    pix = pix.<span class="built_in">scaled</span>(pix.<span class="built_in">width</span>()*<span class="number">0.5</span>, pix.<span class="built_in">height</span>()*<span class="number">0.5</span>);</span><br><span class="line">    painter.<span class="built_in">drawPixmap</span>(<span class="number">30</span>, <span class="number">30</span>, pix);</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>

<h1 id="2-自定义按钮类的封装和开始按钮的特效实现"><a href="#2-自定义按钮类的封装和开始按钮的特效实现" class="headerlink" title="2.自定义按钮类的封装和开始按钮的特效实现"></a>2.自定义按钮类的封装和开始按钮的特效实现</h1><h2 id="2-1-自定义按钮类的封装"><a href="#2-1-自定义按钮类的封装" class="headerlink" title="2.1.自定义按钮类的封装"></a>2.1.自定义按钮类的封装</h2><p>在项目名上右键-&gt;Add New-&gt;C++ Class-&gt;命名为MyPushButton,基类是QWidget-&gt;完成。修改mypushbutton.h的头文件为QPushButton,public继承为QPushButton，注释掉自带的构造函数，改写为<code>MyPushButton(QString normalImg, QString pressImg);</code>,还要声明两个成员变量：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">QString normalImgPath;  <span class="comment">//默认图片显示路径</span></span><br><span class="line">QString pressImgPath;   <span class="comment">//按下后显示图片的路径</span></span><br></pre></td></tr></table></figure>
<p>修改mypushbutton.cpp的public继承为QPushButton，重写构造函数为:</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br></pre></td><td class="code"><pre><span class="line">MyPushButton::<span class="built_in">MyPushButton</span>(QString normalImg, QString pressImg)</span><br><span class="line">&#123;</span><br><span class="line">    <span class="keyword">this</span>-&gt;normalImgPath = normalImg;</span><br><span class="line">    <span class="keyword">this</span>-&gt;pressImgPath = pressImg;</span><br><span class="line"></span><br><span class="line">    QPixmap pix;</span><br><span class="line">    <span class="type">bool</span> ret = pix.<span class="built_in">load</span>(<span class="keyword">this</span>-&gt;normalImgPath);</span><br><span class="line">	<span class="comment">//若路径输入错误，则显示图片加载失败</span></span><br><span class="line">    <span class="keyword">if</span>(!ret)</span><br><span class="line">    &#123;</span><br><span class="line">        QString str = <span class="built_in">QString</span>(<span class="string">&quot;%l 图片加载失败&quot;</span>).<span class="built_in">arg</span>(<span class="keyword">this</span>-&gt;normalImgPath);</span><br><span class="line">        <span class="built_in">qDebug</span>()&lt;&lt;str;</span><br><span class="line">        <span class="keyword">return</span>;</span><br><span class="line">    &#125;</span><br><span class="line"></span><br><span class="line">    <span class="comment">//设置图片大小</span></span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>());</span><br><span class="line"></span><br><span class="line">    <span class="comment">//设置不规则图片样式,使用html语法</span></span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setStyleSheet</span>(<span class="string">&quot;QPushButton&#123;border:0px;&#125;&quot;</span>);</span><br><span class="line">    <span class="comment">//设置图片</span></span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setIcon</span>(pix);</span><br><span class="line"></span><br><span class="line">    <span class="comment">//设置图片大小</span></span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setIconSize</span>(<span class="built_in">QSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>()));</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>在mainscene.cpp的构造函数里添加以下代码测试开始按钮：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//开始按钮的创建</span></span><br><span class="line">MyPushButton * startBtn = <span class="keyword">new</span> <span class="built_in">MyPushButton</span>(<span class="string">&quot;:/res/img/MenuSceneStartButton.png&quot;</span>);</span><br><span class="line">startBtn-&gt;<span class="built_in">setParent</span>(<span class="keyword">this</span>);</span><br><span class="line"><span class="comment">//将按钮图片移动到合适位置</span></span><br><span class="line">startBtn-&gt;<span class="built_in">move</span>(<span class="keyword">this</span>-&gt;<span class="built_in">width</span>()*<span class="number">0.5</span>-startBtn-&gt;<span class="built_in">width</span>()*<span class="number">0.5</span>, <span class="keyword">this</span>-&gt;<span class="built_in">height</span>()*<span class="number">0.5</span>);</span><br><span class="line"><span class="built_in">connect</span>(startBtn, &amp;MyPushButton::clicked, [=]()&#123;</span><br><span class="line">	<span class="built_in">qDebug</span>()&lt;&lt;<span class="string">&quot;点击了开始按钮&quot;</span>;</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
<h2 id="2-2-开始按钮的特效实现"><a href="#2-2-开始按钮的特效实现" class="headerlink" title="2.2.开始按钮的特效实现"></a>2.2.开始按钮的特效实现</h2><p>在mypushbutton.h的public下新增两个函数，用于按钮向上和向下跳跃：<code>void zoom();</code>,<br>并在mypushbutton.cpp里加以实现，先添加头文件：<code>#include&lt;QPropertyAnimation&gt;</code>,再添加以下代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="type">void</span> <span class="title">MyPushButton::zoom</span><span class="params">()</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    QPropertyAnimation * animation = <span class="keyword">new</span> <span class="built_in">QPropertyAnimation</span>(<span class="keyword">this</span>, <span class="string">&quot;geometry&quot;</span>);</span><br><span class="line">    <span class="comment">//设置时间间隔</span></span><br><span class="line">    animation-&gt;<span class="built_in">setDuration</span>(<span class="number">200</span>);</span><br><span class="line">    <span class="comment">//设置动画对象初始位置</span></span><br><span class="line">    animation-&gt;<span class="built_in">setStartValue</span>(<span class="built_in">QRect</span>(<span class="keyword">this</span>-&gt;<span class="built_in">x</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">y</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">width</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">height</span>()));</span><br><span class="line">    <span class="comment">//设置动画对象结束位置</span></span><br><span class="line">    animation-&gt;<span class="built_in">setEndValue</span>(<span class="built_in">QRect</span>(<span class="keyword">this</span>-&gt;<span class="built_in">x</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">y</span>() + <span class="number">10</span>, <span class="keyword">this</span>-&gt;<span class="built_in">width</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">height</span>()));</span><br><span class="line">    <span class="comment">//设置曲线</span></span><br><span class="line">    animation-&gt;<span class="built_in">setEasingCurve</span>(QEasingCurve::OutBounce);</span><br><span class="line">    animation-&gt;<span class="built_in">start</span>();</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>最后还要在mainscene.cpp的connect()函数里完成调用：<code>startBtn-&gt;zoom();</code></p>
<h1 id="3-选关场景"><a href="#3-选关场景" class="headerlink" title="3.选关场景"></a>3.选关场景</h1><h2 id="3-1-基本配置"><a href="#3-1-基本配置" class="headerlink" title="3.1.基本配置"></a>3.1.基本配置</h2><p>在项目名上右键-&gt;Add New-&gt;C++ Class-&gt;类名为ChooseLevelScene,基类为QMainWindow。在mainscene.h里新增变量<code>ChooseLevelScene * chooseScene;</code>,并在mainscene.cpp里添加头文件<code>#include&lt;QTimer&gt;</code>,之后在构造函数添加如下代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//创建第二个选择关卡的场景</span></span><br><span class="line">chooseScene = <span class="keyword">new</span> ChooseLevelScene;</span><br><span class="line"><span class="built_in">connect</span>(startBtn, &amp;MyPushButton::clicked, [=]()&#123;</span><br><span class="line">    <span class="comment">//qDebug()&lt;&lt;&quot;点击了开始按钮&quot;;</span></span><br><span class="line">    <span class="comment">//点击开始按钮，实现弹跳效果</span></span><br><span class="line">    startBtn-&gt;<span class="built_in">zoom</span>();</span><br><span class="line">    <span class="comment">//延时进入第二个场景</span></span><br><span class="line">    QTimer::<span class="built_in">singleShot</span>(<span class="number">500</span>, <span class="keyword">this</span>, [=]()&#123;</span><br><span class="line">        <span class="comment">//将自身隐藏调用</span></span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">hide</span>();</span><br><span class="line">        <span class="comment">//创建第二个选择关卡的场景</span></span><br><span class="line">        chooseScene-&gt;<span class="built_in">show</span>();</span><br><span class="line">    &#125;);</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
<p>运行后发现选关场景的窗口尺寸不对，需要再次设置，在chooselevelscene.cpp的构造函数中添加代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//设置固定大小</span></span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(<span class="number">320</span>, <span class="number">600</span>);</span><br><span class="line"><span class="comment">//设置标题</span></span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setWindowTitle</span>(<span class="string">&quot;选择关卡&quot;</span>);</span><br><span class="line"><span class="comment">//设置窗口图标</span></span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setWindowIcon</span>(<span class="built_in">QIcon</span>(<span class="string">&quot;:/res/img/Coin0001.png&quot;</span>));</span><br><span class="line"><span class="comment">//创建菜单栏</span></span><br><span class="line">QMenuBar * mBar = <span class="built_in">menuBar</span>();</span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setMenuBar</span>(mBar);</span><br><span class="line"></span><br><span class="line"><span class="comment">//创建开始菜单</span></span><br><span class="line">QMenu * startMenu = mBar-&gt;<span class="built_in">addMenu</span>(<span class="string">&quot;开始&quot;</span>);</span><br><span class="line"></span><br><span class="line"><span class="comment">//创建菜单项</span></span><br><span class="line">QAction * quitAction = startMenu-&gt;<span class="built_in">addAction</span>(<span class="string">&quot;退出&quot;</span>);</span><br><span class="line"><span class="comment">//点击退出按钮，实现退出</span></span><br><span class="line"><span class="built_in">connect</span>(quitAction, &amp;QAction::triggered, <span class="keyword">this</span>, &amp;QMainWindow::close);</span><br></pre></td></tr></table></figure>
<p>这样运行后发现还是缺少背景，因此在chooselevelscene.h里声明绘图函数：<code>void paintEvent(QPaintEvent *);</code>,并在chooselevelscene.cpp里添加头文件</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="meta">#<span class="keyword">include</span><span class="string">&lt;QMenuBar&gt;</span></span></span><br><span class="line"><span class="meta">#<span class="keyword">include</span><span class="string">&lt;QMenu&gt;</span></span></span><br><span class="line"><span class="meta">#<span class="keyword">include</span><span class="string">&lt;QPainter&gt;</span></span></span><br></pre></td></tr></table></figure>
<p>再对paintEvent()加以实现,和mainscene.cpp的一样：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="type">void</span> <span class="title">ChooseLevelScene::paintEvent</span><span class="params">(QPaintEvent *)</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    <span class="function">QPainter <span class="title">painter</span><span class="params">(<span class="keyword">this</span>)</span></span>;</span><br><span class="line">    QPixmap pix;</span><br><span class="line">    pix.<span class="built_in">load</span>(<span class="string">&quot;:/res/img/PlayLevelSceneBg.png&quot;</span>);</span><br><span class="line">    <span class="comment">//根据窗口宽高拉伸图片</span></span><br><span class="line">    painter.<span class="built_in">drawPixmap</span>(<span class="number">0</span> ,<span class="number">0</span>, <span class="keyword">this</span>-&gt;<span class="built_in">width</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">height</span>(), pix);</span><br><span class="line"></span><br><span class="line">    <span class="comment">//添加标题图片</span></span><br><span class="line">    pix.<span class="built_in">load</span>(<span class="string">&quot;:/res/img/Title.png&quot;</span>);</span><br><span class="line">    <span class="comment">//更改图片大小</span></span><br><span class="line">    pix = pix.<span class="built_in">scaled</span>(pix.<span class="built_in">width</span>()*<span class="number">0.5</span>, pix.<span class="built_in">height</span>()*<span class="number">0.5</span>);</span><br><span class="line">    painter.<span class="built_in">drawPixmap</span>(<span class="number">30</span>, <span class="number">30</span>, pix);</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>

<h2 id="3-2-返回按钮实现"><a href="#3-2-返回按钮实现" class="headerlink" title="3.2.返回按钮实现"></a>3.2.返回按钮实现</h2><p>在chooselevelscene.cpp里增添头文件：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="meta">#<span class="keyword">include</span><span class="string">&quot;mypushbutton.h&quot;</span></span></span><br><span class="line"><span class="meta">#<span class="keyword">include</span><span class="string">&lt;QDebug&gt;</span></span></span><br></pre></td></tr></table></figure>
<p>在构造函数里添加如下代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//返回按钮的创建</span></span><br><span class="line">MyPushButton * backBtn = <span class="keyword">new</span> <span class="built_in">MyPushButton</span>(<span class="string">&quot;:/res/img/BackButton.png&quot;</span>, <span class="string">&quot;:/res/img/BackButtonSelected.png&quot;</span>);</span><br><span class="line">backBtn-&gt;<span class="built_in">setParent</span>(<span class="keyword">this</span>);</span><br><span class="line">backBtn-&gt;<span class="built_in">move</span>(<span class="keyword">this</span>-&gt;<span class="built_in">width</span>() - backBtn-&gt;<span class="built_in">width</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">height</span>() - backBtn-&gt;<span class="built_in">height</span>());</span><br><span class="line"></span><br><span class="line"><span class="built_in">connect</span>(backBtn, &amp;QPushButton::clicked, [=]()&#123;</span><br><span class="line">    <span class="built_in">qDebug</span>()&lt;&lt;<span class="string">&quot;返回主场景&quot;</span>;</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
<p>转回mypushbutton.h中，添加两个鼠标事件：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//鼠标按下事件</span></span><br><span class="line"><span class="function"><span class="type">void</span> <span class="title">mousePressEvent</span><span class="params">(QMouseEvent * e)</span></span>;</span><br><span class="line"><span class="comment">//鼠标释放事件</span></span><br><span class="line"><span class="function"><span class="type">void</span> <span class="title">mouseReleaseEvent</span><span class="params">(QMouseEvent * e)</span></span>;</span><br></pre></td></tr></table></figure>
<p>并在mypushbutton.cpp中重写：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//鼠标按下事件</span></span><br><span class="line"><span class="function"><span class="type">void</span> <span class="title">MyPushButton::mousePressEvent</span><span class="params">(QMouseEvent * e)</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    <span class="keyword">if</span>(<span class="keyword">this</span>-&gt;pressImgPath != <span class="string">&quot;&quot;</span>)<span class="comment">//传入选中后的图片路径不为空，需要选中后进行图片的切换</span></span><br><span class="line">    &#123;</span><br><span class="line">        QPixmap pix;</span><br><span class="line">        <span class="type">bool</span> ret = pix.<span class="built_in">load</span>(<span class="keyword">this</span>-&gt;pressImgPath);</span><br><span class="line">        <span class="keyword">if</span>(!ret)</span><br><span class="line">        &#123;</span><br><span class="line">            <span class="built_in">qDebug</span>()&lt;&lt;<span class="string">&quot;图片加载失败&quot;</span>;</span><br><span class="line">            <span class="keyword">return</span>;</span><br><span class="line">        &#125;</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>());</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setStyleSheet</span>(<span class="string">&quot;QPushButton&#123;border:0px;&#125;&quot;</span>);</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setIcon</span>(pix);</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setIconSize</span>(<span class="built_in">QSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>()));</span><br><span class="line">    &#125;</span><br><span class="line">    <span class="comment">//其他事情，交给父类处理</span></span><br><span class="line">    QPushButton::<span class="built_in">mousePressEvent</span>(e);</span><br><span class="line">&#125;</span><br><span class="line"></span><br><span class="line"><span class="comment">//鼠标释放事件</span></span><br><span class="line"><span class="function"><span class="type">void</span> <span class="title">MyPushButton::mouseReleaseEvent</span><span class="params">(QMouseEvent * e)</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    <span class="keyword">if</span>(<span class="keyword">this</span>-&gt;pressImgPath != <span class="string">&quot;&quot;</span>)<span class="comment">//传入选中后的图片路径不为空，需要选中后进行图片的切换</span></span><br><span class="line">    &#123;</span><br><span class="line">        QPixmap pix;</span><br><span class="line">        <span class="type">bool</span> ret = pix.<span class="built_in">load</span>(<span class="keyword">this</span>-&gt;normalImgPath);</span><br><span class="line">        <span class="keyword">if</span>(!ret)</span><br><span class="line">        &#123;</span><br><span class="line">            <span class="built_in">qDebug</span>()&lt;&lt;<span class="string">&quot;图片加载失败&quot;</span>;</span><br><span class="line">            <span class="keyword">return</span>;</span><br><span class="line">        &#125;</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>());</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setStyleSheet</span>(<span class="string">&quot;QPushButton&#123;border:0px;&#125;&quot;</span>);</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setIcon</span>(pix);</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setIconSize</span>(<span class="built_in">QSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>()));</span><br><span class="line">    &#125;</span><br><span class="line">    <span class="comment">//其他事情，交给父类处理</span></span><br><span class="line">    QPushButton::<span class="built_in">mouseReleaseEvent</span>(e);</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>运行后发现返回按钮的特效已经实现，但功能没有实现，点击后还是那个页面，因此我们需要在chooselevelscene.h自定义一个信号：<code>void chooseSceneBack();</code>,并在chooselevelscene.cpp的构造函数中发射信号:</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">connect</span>(backBtn, &amp;QPushButton::clicked, [=]()&#123;</span><br><span class="line">    <span class="comment">//qDebug()&lt;&lt;&quot;返回主场景&quot;;</span></span><br><span class="line">    <span class="comment">//延时50ms便于观察返回按钮的特效</span></span><br><span class="line">    QTimer::<span class="built_in">singleShot</span>(<span class="number">500</span>, <span class="keyword">this</span>, [=]()&#123;</span><br><span class="line">        <span class="comment">//隐藏自身</span></span><br><span class="line">        emit <span class="keyword">this</span>-&gt;<span class="built_in">chooseSceneBack</span>();</span><br><span class="line">    &#125;);        </span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
<p>然后在主场景mainscene.cpp中监听返回信号，而且要在场景对象创建后就开始监听：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//创建第二个选择关卡的场景</span></span><br><span class="line">chooseScene = <span class="keyword">new</span> ChooseLevelScene;</span><br><span class="line"><span class="comment">//监听第二个场景的返回信号</span></span><br><span class="line"><span class="built_in">connect</span>(chooseScene, &amp;ChooseLevelScene::chooseSceneBack, [=]()&#123;</span><br><span class="line">    chooseScene-&gt;<span class="built_in">hide</span>();</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">show</span>();</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>

<h2 id="3-3-按钮的具体实现"><a href="#3-3-按钮的具体实现" class="headerlink" title="3.3.按钮的具体实现"></a>3.3.按钮的具体实现</h2><p>在chooselevelscene.cpp中发射信号代码后增加代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//选择关卡按钮</span></span><br><span class="line"><span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">20</span>; ++i)&#123;</span><br><span class="line">    MyPushButton * menuBtn = <span class="keyword">new</span> <span class="built_in">MyPushButton</span>(<span class="string">&quot;:/res/img/LevelIcon.png&quot;</span>);</span><br><span class="line">    menuBtn-&gt;<span class="built_in">setParent</span>(<span class="keyword">this</span>);</span><br><span class="line">    menuBtn-&gt;<span class="built_in">move</span>(<span class="number">25</span> + (i % <span class="number">4</span>) * <span class="number">70</span>, <span class="number">130</span> + i /<span class="number">4</span> * <span class="number">70</span>);</span><br><span class="line"></span><br><span class="line">    <span class="built_in">connect</span>(menuBtn, &amp;MyPushButton::clicked, [=]()&#123;</span><br><span class="line">        QString str = <span class="built_in">QString</span>(<span class="string">&quot;你选择的是第 %1 关&quot;</span>).<span class="built_in">arg</span>(i+<span class="number">1</span>);</span><br><span class="line">        <span class="built_in">qDebug</span>()&lt;&lt;str;</span><br><span class="line">    &#125;);</span><br><span class="line"><span class="comment">//        //使用标签显示文字</span></span><br><span class="line"><span class="comment">//        QLabel * label = new QLabel(this);</span></span><br><span class="line"><span class="comment">//        //设置标签大小</span></span><br><span class="line"><span class="comment">//        label-&gt;setFixedSize(menuBtn-&gt;width(), menuBtn-&gt;height());</span></span><br><span class="line"><span class="comment">//        //设置标签显示内容</span></span><br><span class="line"><span class="comment">//        label-&gt;setText(QString::number(i+1));</span></span><br><span class="line"><span class="comment">//        label-&gt;move(25 + (i % 4) * 70, 130 + i /4 * 70);</span></span><br><span class="line"><span class="comment">//        //设置文字居中</span></span><br><span class="line"><span class="comment">//        label-&gt;setAlignment(Qt::AlignCenter | Qt::AlignVCenter);</span></span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>取消label的注释后会发现鼠标点击关卡没有反应，因为鼠标点击事件被label接收，MyPushButton就接受不到了，就是鼠标事件的拦截。</p>
<h1 id="4-游戏场景的搭建"><a href="#4-游戏场景的搭建" class="headerlink" title="4.游戏场景的搭建"></a>4.游戏场景的搭建</h1><h2 id="4-1场景弹出"><a href="#4-1场景弹出" class="headerlink" title="4.1场景弹出"></a>4.1场景弹出</h2><p>在项目名上右键-&gt;Add New-&gt;C++ Class-&gt;类名为PlayScene,基类是QMainWindow。打开chooselevelscene.h,添加头文件:<code>#include&quot;playscene.h&quot;</code>，并在public下声明一个维护游戏场景的指针：<code>PlayScene * playScene;</code>，回到playscene.h中，声明一个新的构造函数并把之前的注释掉：<code>PlayScene(int index);</code>,接着在playscene.cpp里加以实现：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">PlayScene::<span class="built_in">PlayScene</span>(<span class="type">int</span> index)</span><br><span class="line">&#123;</span><br><span class="line">    <span class="built_in">qDebug</span>()&lt;&lt;<span class="string">&quot;用户选择了第&quot;</span>&lt;&lt;index&lt;&lt;<span class="string">&quot;关&quot;</span>;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>

<h2 id="4-2-场景搭建"><a href="#4-2-场景搭建" class="headerlink" title="4.2.场景搭建"></a>4.2.场景搭建</h2><p>在playscene.h里创建一个成员变量，记录当前关卡的关卡号：<code>int levelIndex;</code>，将chooselevelscene.cpp构造函数的部分代码进行重用：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//保存本关关卡号</span></span><br><span class="line"><span class="keyword">this</span>-&gt;levelIndex = index;</span><br><span class="line"><span class="comment">//设置固定大小</span></span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(<span class="number">320</span>, <span class="number">600</span>);</span><br><span class="line"><span class="comment">//设置标题</span></span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setWindowTitle</span>(<span class="string">&quot;第&quot;</span>+QString::<span class="built_in">number</span>(index)+<span class="string">&quot;关&quot;</span>);</span><br><span class="line"><span class="comment">//设置窗口图标</span></span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setWindowIcon</span>(<span class="built_in">QIcon</span>(<span class="string">&quot;:/res/img/Coin0001.png&quot;</span>));</span><br><span class="line"><span class="comment">//创建菜单栏</span></span><br><span class="line">QMenuBar * mBar = <span class="built_in">menuBar</span>();</span><br><span class="line"><span class="keyword">this</span>-&gt;<span class="built_in">setMenuBar</span>(mBar);</span><br><span class="line"></span><br><span class="line"><span class="comment">//创建开始菜单</span></span><br><span class="line">QMenu * startMenu = mBar-&gt;<span class="built_in">addMenu</span>(<span class="string">&quot;开始&quot;</span>);</span><br><span class="line"></span><br><span class="line"><span class="comment">//创建菜单项</span></span><br><span class="line">QAction * quitAction = startMenu-&gt;<span class="built_in">addAction</span>(<span class="string">&quot;退出&quot;</span>);</span><br><span class="line"><span class="comment">//点击退出按钮，实现退出</span></span><br><span class="line"><span class="built_in">connect</span>(quitAction, &amp;QAction::triggered, <span class="keyword">this</span>, &amp;QMainWindow::close);</span><br></pre></td></tr></table></figure>
<p>但是窗口还缺少背景，因此需要重写绘图事件，在playscene.h里添加代码：<code>void paintEvent(QEvent * e);</code>，之后在playscene.cpp里实现：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="type">void</span> <span class="title">PlayScene::paintEvent</span><span class="params">(QPaintEvent * e)</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    <span class="function">QPainter <span class="title">painter</span><span class="params">(<span class="keyword">this</span>)</span></span>;</span><br><span class="line">    QPixmap pix;</span><br><span class="line">    pix.<span class="built_in">load</span>(<span class="string">&quot;:/res/img/PlayLevelSceneBg.png&quot;</span>);</span><br><span class="line">    <span class="comment">//根据窗口宽高拉伸图片</span></span><br><span class="line">    painter.<span class="built_in">drawPixmap</span>(<span class="number">0</span> ,<span class="number">0</span>, <span class="keyword">this</span>-&gt;<span class="built_in">width</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">height</span>(), pix);</span><br><span class="line"></span><br><span class="line">    <span class="comment">//添加标题图片</span></span><br><span class="line">    pix.<span class="built_in">load</span>(<span class="string">&quot;:/res/img/Title.png&quot;</span>);</span><br><span class="line">    <span class="comment">//更改图片大小</span></span><br><span class="line">    pix = pix.<span class="built_in">scaled</span>(pix.<span class="built_in">width</span>()*<span class="number">0.5</span>, pix.<span class="built_in">height</span>()*<span class="number">0.5</span>);</span><br><span class="line">    painter.<span class="built_in">drawPixmap</span>(<span class="number">30</span>, <span class="number">30</span>, pix);</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>我们还需要实现一个返回按钮，打开playscene.h，在signals下添加代码：<code>void chooseSceneBack();</code>,使其有了自己的返回信号，在playscene.cpp的构造函数添加如下代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//返回按钮的创建</span></span><br><span class="line">MyPushButton * backBtn = <span class="keyword">new</span> <span class="built_in">MyPushButton</span>(<span class="string">&quot;:/res/img/BackButton.png&quot;</span>, <span class="string">&quot;:/res/img/BackButtonSelected.png&quot;</span>);</span><br><span class="line">backBtn-&gt;<span class="built_in">setParent</span>(<span class="keyword">this</span>);</span><br><span class="line">backBtn-&gt;<span class="built_in">move</span>(<span class="keyword">this</span>-&gt;<span class="built_in">width</span>() - backBtn-&gt;<span class="built_in">width</span>(), <span class="keyword">this</span>-&gt;<span class="built_in">height</span>() - backBtn-&gt;<span class="built_in">height</span>());</span><br><span class="line"></span><br><span class="line"><span class="built_in">connect</span>(backBtn, &amp;QPushButton::clicked, [=]()&#123;</span><br><span class="line">    <span class="comment">//qDebug()&lt;&lt;&quot;返回第二场景&quot;;</span></span><br><span class="line">    QTimer::<span class="built_in">singleShot</span>(<span class="number">500</span>, <span class="keyword">this</span>, [=]()&#123;</span><br><span class="line">        <span class="comment">//隐藏自身</span></span><br><span class="line">        emit <span class="keyword">this</span>-&gt;<span class="built_in">chooseSceneBack</span>();</span><br><span class="line">    &#125;);</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
<p>这只是在第三场景发出信号，还应在第二场景chooselevelscene.cpp进行监听：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//进入到具体的游戏场景</span></span><br><span class="line">playScene = <span class="keyword">new</span> <span class="built_in">PlayScene</span>(i+<span class="number">1</span>);<span class="comment">//每次都是新场景</span></span><br><span class="line"><span class="comment">//监听第三个场景的返回信号</span></span><br><span class="line"><span class="built_in">connect</span>(playScene, &amp;PlayScene::chooseSceneBack, [=]()&#123;</span><br><span class="line">    <span class="comment">//显示选关场景，隐藏游戏场景</span></span><br><span class="line">    <span class="comment">//playScene-&gt;hide();</span></span><br><span class="line">    playScene-&gt;<span class="built_in">close</span>();</span><br><span class="line">    <span class="keyword">delete</span> playScene;</span><br><span class="line">    playScene = <span class="literal">NULL</span>;</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">show</span>();</span><br><span class="line">&#125;);</span><br><span class="line">playScene-&gt;<span class="built_in">show</span>();</span><br></pre></td></tr></table></figure>
<p>返回playscene.cpp中，使其显示关卡号：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//显示具体关卡号</span></span><br><span class="line">QLabel * label = <span class="keyword">new</span> QLabel;</span><br><span class="line">label-&gt;<span class="built_in">setParent</span>(<span class="keyword">this</span>);</span><br><span class="line">QString str = <span class="built_in">QString</span>(<span class="string">&quot;level: %1&quot;</span>).<span class="built_in">arg</span>(<span class="keyword">this</span>-&gt;levelIndex);</span><br><span class="line"><span class="comment">//修改字体，使其易于观察</span></span><br><span class="line">QFont font;</span><br><span class="line">font.<span class="built_in">setFamily</span>(<span class="string">&quot;宋体&quot;</span>);</span><br><span class="line">font.<span class="built_in">setPointSize</span>(<span class="number">12</span>);</span><br><span class="line"><span class="comment">//让label使用上面的字体</span></span><br><span class="line">label-&gt;<span class="built_in">setFont</span>(font);</span><br><span class="line"></span><br><span class="line">label-&gt;<span class="built_in">setText</span>(str);</span><br><span class="line">label-&gt;<span class="built_in">setGeometry</span>(<span class="built_in">QRect</span>(<span class="number">30</span>, <span class="keyword">this</span>-&gt;<span class="built_in">height</span>()<span class="number">-50</span>, <span class="number">120</span>, <span class="number">50</span>));</span><br></pre></td></tr></table></figure>
<p>接下来在上面代码下添加创建金币背景图片的代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//创建金币的背景图片</span></span><br><span class="line"><span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">4</span>; ++i)&#123;</span><br><span class="line">    <span class="keyword">for</span>(<span class="type">int</span> j=<span class="number">0</span>; j&lt;<span class="number">5</span>; ++j)&#123;</span><br><span class="line">        <span class="comment">//QLabel显示图片</span></span><br><span class="line">        QLabel * bg = <span class="keyword">new</span> <span class="built_in">QLabel</span>(<span class="keyword">this</span>);</span><br><span class="line">        QPixmap pix;</span><br><span class="line">        pix.<span class="built_in">load</span>(<span class="string">&quot;:/res/img/BoardNode.png&quot;</span>);</span><br><span class="line">        bg-&gt;<span class="built_in">setGeometry</span>(<span class="number">0</span>, <span class="number">0</span>, pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>());</span><br><span class="line">        bg-&gt;<span class="built_in">setPixmap</span>(pix);</span><br><span class="line">        bg-&gt;<span class="built_in">move</span>(<span class="number">57</span>+i*pix.<span class="built_in">width</span>(), <span class="number">200</span>+j*pix.<span class="built_in">height</span>());</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<h2 id="4-3-金币类的封装与金币翻转的实现"><a href="#4-3-金币类的封装与金币翻转的实现" class="headerlink" title="4.3.金币类的封装与金币翻转的实现"></a>4.3.金币类的封装与金币翻转的实现</h2><ul>
<li>1.类的封装<br>新建MyCoin类，继承QWidget,之后修改基类为QPushButton，并在mycoin.h里注释掉原有的构造函数，新建构造函数：<code>MyCoin(QString CoinImage);</code>,在mycoin.cpp里重写构造函数：<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><span class="line">MyCoin::<span class="built_in">MyCoin</span>(QString CoinImage)</span><br><span class="line">&#123;</span><br><span class="line">    QPixmap pix;</span><br><span class="line">    <span class="type">bool</span> ret = pix.<span class="built_in">load</span>(CoinImage);</span><br><span class="line">    <span class="keyword">if</span>(ret)&#123;</span><br><span class="line">        QString str = <span class="built_in">QString</span>(<span class="string">&quot;图片加载失败 %1&quot;</span>).<span class="built_in">arg</span>(CoinImage);</span><br><span class="line">        <span class="built_in">qDebug</span>()&lt;&lt;str;</span><br><span class="line">        QMessageBox::<span class="built_in">critical</span>(<span class="keyword">this</span>, <span class="string">&quot;加载失败&quot;</span>, str);</span><br><span class="line">        <span class="keyword">return</span>;</span><br><span class="line">    &#125;</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>());</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setStyleSheet</span>(<span class="string">&quot;QPushButton&#123;border:0px;&#125;&quot;</span>);</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setIcon</span>(pix);</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setIconSize</span>(<span class="built_in">QSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>()));</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
回到playscene.cpp里的构造函数，在双重for循环里添加如下代码：<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//创建金币</span></span><br><span class="line">MyCoin * coin = <span class="keyword">new</span> <span class="built_in">MyCoin</span>(<span class="string">&quot;:/res/img/Coin0001.png&quot;</span>);</span><br><span class="line">coin-&gt;<span class="built_in">setParent</span>(<span class="keyword">this</span>);</span><br><span class="line">coin-&gt;<span class="built_in">move</span>(<span class="number">60</span>+i*pix.<span class="built_in">width</span>(), <span class="number">203</span>+j*pix.<span class="built_in">height</span>());</span><br></pre></td></tr></table></figure></li>
<li>2.游戏场景实现</li>
</ul>
<p>新建类dataConfig,基类为QObject,在dataconfig.h里添加头文件：<code>#include&lt;QMap&gt;</code>和<code>#include&lt;QVector&gt;</code>，在public下声明<code>QMap&lt;int, QVector&lt;QVector&lt;int&gt; &gt; &gt; mData;</code>，接下来在dataconfig.cpp的构造函数里加以实现：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//1是金币，0是银币</span></span><br><span class="line"><span class="type">int</span> arr1[<span class="number">4</span>][<span class="number">5</span>] = &#123;&#123;<span class="number">1</span>, <span class="number">1</span>, <span class="number">1</span>, <span class="number">1</span>, <span class="number">1</span>&#125;,</span><br><span class="line">                    &#123;<span class="number">1</span>, <span class="number">1</span>, <span class="number">0</span>, <span class="number">1</span>, <span class="number">0</span>&#125;,</span><br><span class="line">                    &#123;<span class="number">1</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">0</span>&#125;,</span><br><span class="line">                    &#123;<span class="number">1</span>, <span class="number">1</span>, <span class="number">0</span>, <span class="number">1</span>, <span class="number">0</span>&#125;&#125;;<span class="comment">//第一关</span></span><br><span class="line">QVector&lt;QVector&lt;<span class="type">int</span>&gt; &gt; v;</span><br><span class="line"><span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">4</span>; ++i)&#123;</span><br><span class="line">    QVector&lt;<span class="type">int</span>&gt; v1;</span><br><span class="line">    <span class="keyword">for</span>(<span class="type">int</span> j=<span class="number">0</span>; j&lt;<span class="number">5</span>; ++j)&#123;</span><br><span class="line">        v1.<span class="built_in">push_back</span>(arr1[i][j]);</span><br><span class="line">    &#125;</span><br><span class="line">    v.<span class="built_in">push_back</span>(v1);</span><br><span class="line">&#125;</span><br><span class="line">mData.<span class="built_in">insert</span>(<span class="number">1</span>, v);</span><br><span class="line"></span><br><span class="line"><span class="type">int</span> arr2[<span class="number">4</span>][<span class="number">5</span>] = &#123;&#123;<span class="number">0</span>, <span class="number">1</span>, <span class="number">0</span>, <span class="number">1</span>, <span class="number">0</span>&#125;,</span><br><span class="line">                    &#123;<span class="number">1</span>, <span class="number">1</span>, <span class="number">0</span>, <span class="number">1</span>, <span class="number">1</span>&#125;,</span><br><span class="line">                    &#123;<span class="number">1</span>, <span class="number">0</span>, <span class="number">1</span>, <span class="number">0</span>, <span class="number">1</span>&#125;,</span><br><span class="line">                    &#123;<span class="number">1</span>, <span class="number">0</span>, <span class="number">0</span>, <span class="number">1</span>, <span class="number">1</span>&#125;&#125;;</span><br><span class="line">v.<span class="built_in">clear</span>();</span><br><span class="line"><span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">4</span>; ++i)&#123;</span><br><span class="line">    QVector&lt;<span class="type">int</span>&gt; v1;</span><br><span class="line">    <span class="keyword">for</span>(<span class="type">int</span> j=<span class="number">0</span>; j&lt;<span class="number">5</span>; ++j)&#123;</span><br><span class="line">        v1.<span class="built_in">push_back</span>(arr2[i][j]);</span><br><span class="line">    &#125;</span><br><span class="line">    v.<span class="built_in">push_back</span>(v1);</span><br><span class="line">&#125;</span><br><span class="line">mData.<span class="built_in">insert</span>(<span class="number">2</span>, v);</span><br></pre></td></tr></table></figure>
<p>在mycoin.h里添加属性记录金币类的坐标和正反标志：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="type">int</span> posX;</span><br><span class="line"><span class="type">int</span> posY;</span><br><span class="line"><span class="type">bool</span> flag;<span class="comment">//true为正，false为反</span></span><br></pre></td></tr></table></figure>
<p>在playscene.h里创建一个二维数组，维护金币或银币标志：<code>int gameArr[4][5];</code>,并在playscene.cpp的构造函数里创建金币背景之前添加如下代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">dataConfig data;</span><br><span class="line"><span class="comment">//初始化游戏中的二维数组</span></span><br><span class="line"><span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">4</span>; ++i)&#123;</span><br><span class="line">    <span class="keyword">for</span>(<span class="type">int</span> j=<span class="number">0</span>; j&lt;<span class="number">5</span>; ++j)&#123;</span><br><span class="line">        <span class="keyword">this</span>-&gt;gameArr[i][j] = data.mData[<span class="keyword">this</span>-&gt;levelIndex][i][j];</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>并且要在双重for循环创建金币时进行判断,究竟是创建金币还是创建银币，还要同时对金币类的属性进行初始化：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//创建金币</span></span><br><span class="line"><span class="keyword">if</span>(<span class="keyword">this</span>-&gt;gameArr[i][j] == <span class="number">1</span>)&#123;</span><br><span class="line">    <span class="comment">//金币</span></span><br><span class="line">    str = <span class="string">&quot;:/res/img/Coin0001.png&quot;</span>;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">else</span>&#123;</span><br><span class="line">    <span class="comment">//银币</span></span><br><span class="line">    str = <span class="string">&quot;:/res/img/Coin0008.png&quot;</span>;</span><br><span class="line">&#125;</span><br><span class="line">MyCoin * coin = <span class="keyword">new</span> <span class="built_in">MyCoin</span>(str);</span><br><span class="line">coin-&gt;posX = i;</span><br><span class="line">coin-&gt;posY = j;</span><br><span class="line">coin-&gt;flag = <span class="keyword">this</span>-&gt;gameArr[i][j];</span><br></pre></td></tr></table></figure>
<ul>
<li>3.金币翻转的实现</li>
</ul>
<p>在mycoin.h里添加如下代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">QTimer * timer1;    <span class="comment">//正面翻反面,定时器</span></span><br><span class="line">QTimer * timer2;    <span class="comment">//反面翻正面,定时器</span></span><br><span class="line"><span class="type">int</span> min=<span class="number">1</span>;            <span class="comment">//最小图片</span></span><br><span class="line"><span class="type">int</span> max=<span class="number">8</span>;            <span class="comment">//最大图片</span></span><br><span class="line"><span class="function"><span class="type">void</span> <span class="title">changeFlag</span><span class="params">()</span></span>;  <span class="comment">//改变标志，执行翻转效果</span></span><br></pre></td></tr></table></figure>
<p>并在mycoin.cpp里重写changeFlag()函数：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="type">void</span> <span class="title">MyCoin::changeFlag</span><span class="params">()</span>  <span class="comment">//改变标志，执行翻转效果</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    <span class="keyword">if</span>(<span class="keyword">this</span>-&gt;flag)&#123;<span class="comment">//当前是正面</span></span><br><span class="line">        <span class="comment">//开启正面 翻 反面的定时器</span></span><br><span class="line">        timer1-&gt;<span class="built_in">start</span>(<span class="number">30</span>);</span><br><span class="line">        <span class="keyword">this</span>-&gt;flag = <span class="literal">false</span>;</span><br><span class="line">    &#125;</span><br><span class="line">    <span class="keyword">else</span>&#123;<span class="comment">//当前是反面</span></span><br><span class="line">        <span class="comment">//开启反面 翻 正面的定时器</span></span><br><span class="line">        timer2-&gt;<span class="built_in">start</span>(<span class="number">30</span>);</span><br><span class="line">        <span class="keyword">this</span>-&gt;flag = <span class="literal">true</span>;</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>在mycoin.cpp的构造函数里对翻转定时器进行初始化,同时还要对定时器进行监听：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br></pre></td><td class="code"><pre><span class="line">timer1 = <span class="keyword">new</span> <span class="built_in">QTimer</span>(<span class="keyword">this</span>);</span><br><span class="line">timer2 = <span class="keyword">new</span> <span class="built_in">QTimer</span>(<span class="keyword">this</span>);</span><br><span class="line"><span class="comment">//监听定时器1,监听金币翻银币</span></span><br><span class="line"><span class="built_in">connect</span>(timer1, &amp;QTimer::timeout, [=]()&#123;</span><br><span class="line">    QPixmap pix;</span><br><span class="line">    QString str = <span class="built_in">QString</span>(<span class="string">&quot;:/res/img/Coin000%1.png&quot;</span>).<span class="built_in">arg</span>(<span class="keyword">this</span>-&gt;min++);</span><br><span class="line">    pix.<span class="built_in">load</span>(str);</span><br><span class="line"></span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>());</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setStyleSheet</span>(<span class="string">&quot;QPushButton&#123;border:0px;&#125;&quot;</span>);</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setIcon</span>(pix);</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setIconSize</span>(<span class="built_in">QSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>()));</span><br><span class="line"></span><br><span class="line">    <span class="comment">//如果显示到最后一张图片，停止定时器</span></span><br><span class="line">    <span class="keyword">if</span>(<span class="keyword">this</span>-&gt;min &gt; <span class="keyword">this</span>-&gt;max)&#123;</span><br><span class="line">        <span class="keyword">this</span>-&gt;min = <span class="number">1</span>;<span class="comment">//重置最小值</span></span><br><span class="line">        timer1-&gt;<span class="built_in">stop</span>();</span><br><span class="line">    &#125;</span><br><span class="line">&#125;);</span><br><span class="line"><span class="comment">//监听定时器2，监听银币翻金币</span></span><br><span class="line"><span class="built_in">connect</span>(timer2, &amp;QTimer::timeout, [=]()&#123;</span><br><span class="line">    QPixmap pix;</span><br><span class="line">    QString str = <span class="built_in">QString</span>(<span class="string">&quot;:/res/img/Coin000%1.png&quot;</span>).<span class="built_in">arg</span>(<span class="keyword">this</span>-&gt;max--);</span><br><span class="line">    pix.<span class="built_in">load</span>(str);</span><br><span class="line"></span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>());</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setStyleSheet</span>(<span class="string">&quot;QPushButton&#123;border:0px;&#125;&quot;</span>);</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setIcon</span>(pix);</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">setIconSize</span>(<span class="built_in">QSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>()));</span><br><span class="line"></span><br><span class="line">    <span class="comment">//如果显示到最后一张图片，停止定时器</span></span><br><span class="line">    <span class="keyword">if</span>(<span class="keyword">this</span>-&gt;max &lt; <span class="keyword">this</span>-&gt;min)&#123;</span><br><span class="line">        <span class="keyword">this</span>-&gt;max = <span class="number">8</span>;<span class="comment">//重置最大值</span></span><br><span class="line">        timer2-&gt;<span class="built_in">stop</span>();</span><br><span class="line">    &#125;</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
<p>接下来在playscene.cpp的构造函数里的双重for循环里监听金币的点击信号：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">connect</span>(coin, &amp;MyCoin::clicked, [=]()&#123;</span><br><span class="line">    coin-&gt;<span class="built_in">changeFlag</span>();</span><br><span class="line">    <span class="comment">//同步二维数组维护的正反面标志</span></span><br><span class="line">    gameArr[i][j] = gameArr[i][j] == <span class="number">0</span> ? <span class="number">1</span> : <span class="number">0</span>;</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
<p>运行后发现金币翻转已经实现，但是如果我们点击的很快的话，会发现第一个翻转动画未完成就会开始第二个翻转动画，为了避免这种情况，我们需要在mycoin.h里设置一个标志表示正在执行动画，执行完才会执行下一个动画：<code>bool isAnimation;</code>,并在mycoin.cpp的构造函数里,定时器初始化前进行初始化：<code>isAnimation = false;</code>，接下来在changeFlag()函数里if()else判断中同步执行动画标志：<code>isAnimation = true;</code>,表示动画执行中；并且在监听定时器动作中，定时器stop()之前同步执行动画标志：<code>isAnimation = false;</code>,表示动画执行完。<br>那么从哪里开始判断动画是否在执行呢？接下来回到mycoin.h里，对鼠标事件重写：<code>void mousePressEvent(QMouseEvent *);</code>,并在mycoin.cpp里实现：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//鼠标按下事件重写</span></span><br><span class="line"><span class="function"><span class="type">void</span> <span class="title">MyCoin::mousePressEvent</span><span class="params">(QMouseEvent * e)</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    <span class="keyword">if</span>(<span class="keyword">this</span>-&gt;isAnimation)&#123;</span><br><span class="line">        <span class="comment">//正在执行动画，不做鼠标响应</span></span><br><span class="line">        <span class="keyword">return</span>;</span><br><span class="line">    &#125;</span><br><span class="line">    <span class="keyword">else</span>&#123;</span><br><span class="line">        <span class="comment">//交给父类做默认处理</span></span><br><span class="line">        QPushButton::<span class="built_in">mousePressEvent</span>(e);</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>

<ul>
<li>4.翻转周围的金币</li>
</ul>
<p>想要翻转金币周围的金币，需要将他们记录下来，但是在playscene.cpp的双重for循环里的MyCoin类会在下次循环前销毁，所以不合适。我们要在playscene.h里声明一个按钮数组记录点击金币周围的金币：<code>MyCoin * coinBtn[4][5];</code>,之后回到playscene.cpp的构造函数里的双重for循环中，在MyCoin初始化完成后将其放入按钮数组并检测上下左右的金币是否能够翻动：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br></pre></td><td class="code"><pre><span class="line">coinBtn[i][j] = coin;</span><br><span class="line"><span class="built_in">connect</span>(coin, &amp;MyCoin::clicked, [=]()&#123;</span><br><span class="line">    coin-&gt;<span class="built_in">changeFlag</span>();</span><br><span class="line">    <span class="comment">//同步二维数组维护的正反面标志</span></span><br><span class="line">    gameArr[i][j] = ~gameArr[i][j];</span><br><span class="line">    <span class="comment">//继续翻周围的金币</span></span><br><span class="line">    <span class="comment">//延时翻动硬币</span></span><br><span class="line">    QTimer::<span class="built_in">singleShot</span>(<span class="number">100</span>, <span class="keyword">this</span>, [=]()&#123;</span><br><span class="line">        <span class="comment">//检测翻右侧硬币</span></span><br><span class="line">        <span class="keyword">if</span>(coin-&gt;posX + <span class="number">1</span> &lt;= <span class="number">3</span>)&#123;</span><br><span class="line">            coinBtn[coin-&gt;posX+<span class="number">1</span>][coin-&gt;posY]-&gt;<span class="built_in">changeFlag</span>();</span><br><span class="line">            gameArr[coin-&gt;posX+<span class="number">1</span>][coin-&gt;posY] = ~gameArr[coin-&gt;posX+<span class="number">1</span>][coin-&gt;posY];</span><br><span class="line">        &#125;</span><br><span class="line">        <span class="comment">//检测翻左侧硬币</span></span><br><span class="line">        <span class="keyword">if</span>(coin-&gt;posX - <span class="number">1</span> &gt;= <span class="number">0</span>)&#123;</span><br><span class="line">            coinBtn[coin-&gt;posX<span class="number">-1</span>][coin-&gt;posY]-&gt;<span class="built_in">changeFlag</span>();</span><br><span class="line">            gameArr[coin-&gt;posX<span class="number">-1</span>][coin-&gt;posY] = ~gameArr[coin-&gt;posX<span class="number">-1</span>][coin-&gt;posY];</span><br><span class="line">        &#125;</span><br><span class="line">        <span class="comment">//检测翻下侧硬币</span></span><br><span class="line">        <span class="keyword">if</span>(coin-&gt;posY + <span class="number">1</span> &lt;= <span class="number">4</span>)&#123;</span><br><span class="line">            coinBtn[coin-&gt;posX][coin-&gt;posY+<span class="number">1</span>]-&gt;<span class="built_in">changeFlag</span>();</span><br><span class="line">            gameArr[coin-&gt;posX][coin-&gt;posY+<span class="number">1</span>] = ~gameArr[coin-&gt;posX][coin-&gt;posY+<span class="number">1</span>];</span><br><span class="line">        &#125;</span><br><span class="line">        <span class="comment">//检测翻上侧硬币</span></span><br><span class="line">        <span class="keyword">if</span>(coin-&gt;posY - <span class="number">1</span> &gt;= <span class="number">0</span>)&#123;</span><br><span class="line">            coinBtn[coin-&gt;posX][coin-&gt;posY<span class="number">-1</span>]-&gt;<span class="built_in">changeFlag</span>();</span><br><span class="line">            gameArr[coin-&gt;posX][coin-&gt;posY<span class="number">-1</span>] = ~gameArr[coin-&gt;posX][coin-&gt;posY<span class="number">-1</span>];</span><br><span class="line">        &#125;</span><br><span class="line">    &#125;);</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>

<h2 id="4-4-场景切换的优化"><a href="#4-4-场景切换的优化" class="headerlink" title="4.4.场景切换的优化"></a>4.4.场景切换的优化</h2><p>当我们移动主场景时，点击开始按钮，选关场景不会出现在移动后主场景位置后，而是初始化时主场景的位置。<br>为了解决这个问题，我们回到主场景mainscene.cpp中，在延时进入第二场景的代码里，第二场景创建之前设置好它的位置：<code>chooseScene-&gt;setGeometry(this-&gt;geometry());</code>。返回按钮被点击时也应做到这种效果，所以在监听第二场景的返回信号时添加代码：<code>this-&gt;setGeometry(chooseScene-&gt;geometry());</code>。<br>二三场景切换同理，在进入到具体的游戏场景与监听第三个场景的返回信号之间将游戏场景与选关场景的位置同步：<code>playScene-&gt;setGeometry(this-&gt;geometry());</code>,在监听第三场景返回信号时，同步选关场景与游戏场景的位置：<code>this-&gt;setGeometry(playScene-&gt;geometry());</code>。</p>
<h1 id="5-检测胜利"><a href="#5-检测胜利" class="headerlink" title="5.检测胜利"></a>5.检测胜利</h1><h2 id="5-1-胜利检测"><a href="#5-1-胜利检测" class="headerlink" title="5.1.胜利检测"></a>5.1.胜利检测</h2><p>在playscene.h里添加一个用于检测游戏胜利的标志：<code>bool isWin;</code>,并在playscene.cpp的构造函数里，返回按钮创建之前进行初始化：<code>isWin = false;</code>,并在双重for循环检测硬币翻转后添加代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//翻完周围硬币后检测是否全是金币，如果是则游戏胜利</span></span><br><span class="line"><span class="keyword">this</span>-&gt;isWin = <span class="literal">true</span>;</span><br><span class="line"><span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">4</span>; ++i)&#123;</span><br><span class="line">    <span class="keyword">for</span>(<span class="type">int</span> j=<span class="number">0</span>; j&lt;<span class="number">5</span>; ++j)&#123;</span><br><span class="line">        <span class="keyword">if</span>(coinBtn[i][j]-&gt;flag == <span class="literal">false</span>)&#123;</span><br><span class="line">            <span class="keyword">this</span>-&gt;isWin = <span class="literal">false</span>;</span><br><span class="line">            <span class="keyword">break</span>;</span><br><span class="line">        &#125;</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br><span class="line"><span class="keyword">if</span>(<span class="keyword">this</span>-&gt;isWin == <span class="literal">true</span>)&#123;</span><br><span class="line">    <span class="built_in">qDebug</span>()&lt;&lt;<span class="string">&quot;WIN&quot;</span>;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>

<h2 id="5-2-胜利的操作"><a href="#5-2-胜利的操作" class="headerlink" title="5.2.胜利的操作"></a>5.2.胜利的操作</h2><ul>
<li><p>1.禁用按钮<br>在mycoin.h里添加检测是否胜利的标志：<code>bool isWin;</code>,并在mycoin.cpp的构造函数里,是否执行动画标志初始化之前初始化：<code>isWin = false;</code>，并在playscene.cpp里检测胜利后添加代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">if</span>(<span class="keyword">this</span>-&gt;isWin == <span class="literal">true</span>)&#123;</span><br><span class="line">    <span class="built_in">qDebug</span>()&lt;&lt;<span class="string">&quot;WIN&quot;</span>;</span><br><span class="line">    <span class="comment">//将所有硬币的检测胜利标志设置为true,禁用按钮点击事件</span></span><br><span class="line">    <span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">4</span>; ++i)&#123;</span><br><span class="line">        <span class="keyword">for</span>(<span class="type">int</span> j=<span class="number">0</span>; j&lt;<span class="number">5</span>; ++j)&#123;</span><br><span class="line">            coinBtn[i][j]-&gt;isWin = <span class="literal">true</span>;</span><br><span class="line">        &#125;</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
<p>重写鼠标按下事件，实现禁用按钮：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//鼠标按下事件重写</span></span><br><span class="line"><span class="function"><span class="type">void</span> <span class="title">MyCoin::mousePressEvent</span><span class="params">(QMouseEvent * e)</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    <span class="keyword">if</span>(<span class="keyword">this</span>-&gt;isAnimation || <span class="keyword">this</span>-&gt;isWin==<span class="literal">true</span>)&#123;</span><br><span class="line">        <span class="comment">//正在执行动画，不做鼠标响应</span></span><br><span class="line">        <span class="keyword">return</span>;</span><br><span class="line">    &#125;</span><br><span class="line">    <span class="keyword">else</span>&#123;</span><br><span class="line">        <span class="comment">//交给父类做默认处理</span></span><br><span class="line">        QPushButton::<span class="built_in">mousePressEvent</span>(e);</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
</li>
<li><p>2.胜利图案的显示</p>
</li>
</ul>
<p>图案是早就创建好的，但是在屏幕上方，所以看不到。在playscene.cpp构造函数创建金币背景图片之前添加代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//创建胜利的图片</span></span><br><span class="line">QLabel * winLabel = <span class="keyword">new</span> <span class="built_in">QLabel</span>(<span class="keyword">this</span>);</span><br><span class="line">QPixmap pix;</span><br><span class="line">pix.<span class="built_in">load</span>(<span class="string">&quot;:/res/img/LevelCompletedDialogBg.png&quot;</span>);</span><br><span class="line">winLabel-&gt;<span class="built_in">setGeometry</span>(<span class="built_in">QRect</span>(<span class="number">0</span>, <span class="number">0</span>, pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>()));</span><br><span class="line">winLabel-&gt;<span class="built_in">setPixmap</span>(pix);</span><br><span class="line">winLabel-&gt;<span class="built_in">move</span>((<span class="keyword">this</span>-&gt;<span class="built_in">width</span>()-pix.<span class="built_in">width</span>())*<span class="number">0.5</span>, -pix.<span class="built_in">height</span>());</span><br></pre></td></tr></table></figure>
<p>然后添加头文件：<code>#include&lt;QPropertyAnimation&gt;</code>,并在<code>将所有硬币的检测胜利标志设置为true,禁用按钮点击事件</code>的双重for循环后添加代码：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//将胜利的图片显示出来</span></span><br><span class="line">QPropertyAnimation * animation = <span class="keyword">new</span> <span class="built_in">QPropertyAnimation</span>(winLabel, <span class="string">&quot;geometry&quot;</span>);</span><br><span class="line"></span><br><span class="line">animation-&gt;<span class="built_in">setDuration</span>(<span class="number">1000</span>);<span class="comment">//设置间隔一秒</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//设置动画开始和结束的位置</span></span><br><span class="line">animation-&gt;<span class="built_in">setStartValue</span>(<span class="built_in">QRect</span>(winLabel-&gt;<span class="built_in">x</span>(), winLabel-&gt;<span class="built_in">y</span>(), winLabel-&gt;<span class="built_in">width</span>(), winLabel-&gt;<span class="built_in">height</span>()));</span><br><span class="line">animation-&gt;<span class="built_in">setEndValue</span>(<span class="built_in">QRect</span>(winLabel-&gt;<span class="built_in">x</span>(), winLabel-&gt;<span class="built_in">y</span>()+<span class="number">114</span>, winLabel-&gt;<span class="built_in">width</span>(), winLabel-&gt;<span class="built_in">height</span>()));</span><br><span class="line"></span><br><span class="line"><span class="comment">//设置缓和曲线</span></span><br><span class="line">animation-&gt;<span class="built_in">setEasingCurve</span>(QEasingCurve::OutBounce);</span><br><span class="line">animation-&gt;<span class="built_in">start</span>();</span><br></pre></td></tr></table></figure>

<h2 id="5-3-Bug解决"><a href="#5-3-Bug解决" class="headerlink" title="5.3.Bug解决"></a>5.3.Bug解决</h2><p>当你点击硬币使其全部变成金币后会显示胜利图案，但是这之间有短暂时间可以让你点击其他硬币，这时显示胜利时界面上并不全是金币。为了解决这个问题，我们需要在点击一个硬币时屏蔽其他点击，当周围硬币翻转完成后解禁硬币点击事件，之后检测是否胜利，胜利则屏蔽点击事件。做到这些只需要在之前代码的检测硬币翻转之后，检测游戏胜利前添加代码解禁硬币点击事件：</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">4</span>; ++i)&#123;</span><br><span class="line">    <span class="keyword">for</span>(<span class="type">int</span> j=<span class="number">0</span>; j&lt;<span class="number">5</span>; ++j)&#123;</span><br><span class="line">        coinBtn[i][j]-&gt;isWin = <span class="literal">false</span>;</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>

<h1 id="6-音效添加"><a href="#6-音效添加" class="headerlink" title="6.音效添加"></a>6.音效添加</h1><h2 id="6-1-开始按钮音效"><a href="#6-1-开始按钮音效" class="headerlink" title="6.1.开始按钮音效"></a>6.1.开始按钮音效</h2><p>在.pro文件里添加模块multimedia：<code>QT       += core gui multimedia</code>,打开mainscene.cpp，b包含头文件：<code>#include&lt;QSound&gt;</code>，在开始按钮创建的代码后添加代码：<code>QSound * startSound = new QSound(&quot;:/res/music/TapButtonSound.wav&quot;);</code>，然后在点击开始按钮后播放：<code>startSound-&gt;play();</code>。</p>
<h2 id="6-2-选择按钮音效"><a href="#6-2-选择按钮音效" class="headerlink" title="6.2.选择按钮音效"></a>6.2.选择按钮音效</h2><p>然后再第二个场景chooselevelscene.cpp里创建返回按钮之前：<code>QSound * chooseSound = new QSound(&quot;:/res/music/TapButtonSound.wav&quot;);</code>，再跳到选择关卡按钮代码里，connect()里添加代码：<code>chooseSound-&gt;play();</code>。</p>
<h2 id="6-3-返回按钮音效"><a href="#6-3-返回按钮音效" class="headerlink" title="6.3.返回按钮音效"></a>6.3.返回按钮音效</h2><p>在第二第三个场景里完善返回按钮的音效：<code>QSound * backSound = new QSound(&quot;:/res/music/BackButtonSound.wav&quot;);</code>，并在按下返回按钮时播放音效：<code>backSound-&gt;play();</code>。</p>
<h2 id="6-4-翻金币音效"><a href="#6-4-翻金币音效" class="headerlink" title="6.4.翻金币音效"></a>6.4.翻金币音效</h2><p><code>QSound * clickSound = new QSound(&quot;:/res/music/ConFlipSound.wav&quot;);</code>,在playscene.cpp里找到点击硬币的代码，添加：<code>clickSound-&gt;play();</code></p>
<h2 id="6-5-游戏胜利音效"><a href="#6-5-游戏胜利音效" class="headerlink" title="6.5.游戏胜利音效"></a>6.5.游戏胜利音效</h2><p><code>QSound * winSound = new QSound(&quot;:/res/music/LevelWinSound.wav&quot;);</code>,在playscene.cpp里找到游戏胜利的代码，添加：<code>winSound-&gt;play();</code></p>
<h1 id="7-思路总结"><a href="#7-思路总结" class="headerlink" title="7.思路总结"></a>7.思路总结</h1><h2 id="7-1-创建主场景"><a href="#7-1-创建主场景" class="headerlink" title="7.1.创建主场景"></a>7.1.创建主场景</h2><ul>
<li>1.菜单栏上有开始和退出两个QAction，因此需要用信号与槽connect()对退出动作进行监听,一旦收到actionquit的<code>QAction::triggered</code>信号，就要关闭窗口：<code>close()</code>。</li>
<li>2.窗口属性<ul>
<li>1.设置窗口大小 <code>setFixedSize(width, height)</code>,参数是窗口的宽和高</li>
<li>2.设置标题 <code>setWindowTitle(str)</code></li>
<li>3.设置窗口图标 <code>setWindowIcon(QIcon(imgPath))</code>,需要先将图片路径转换为QIcon对象</li>
</ul>
</li>
<li>3.用绘图事件给窗口添加背景图片<ul>
<li>1.在头文件里重写绘图事件 <code>void paintEvent(QPaintEvent *);</code>,在.cpp文件里实现绘图事件<code>paintEvent</code></li>
<li>2.画家类初始化 <code>QPainter painter(this);</code>,参数是画家的父对象，也就是画的位置</li>
<li>3.图片对象初始化 <code>QPixmap pix;</code></li>
<li>4.加载图片 <code>pix.load(imgPath);</code></li>
<li>5.根据窗口的宽高拉伸图片大小 <code>drawPixmap(0 ,0, this-&gt;width(), this-&gt;height(), pix);</code>,第一二参数绘图的原点，三四参数是绘图的宽高，第五参数是绘图的对象。</li>
<li>6.给背景图片加标题图片并更改图片大小    <figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">pix.<span class="built_in">load</span>(imgPath);</span><br><span class="line">pix = pix.<span class="built_in">scaled</span>(width, height);</span><br><span class="line">painter.<span class="built_in">drawPixmap</span>(<span class="number">30</span>, <span class="number">30</span>, pix);</span><br></pre></td></tr></table></figure>
  更改图片大小 <code>scaled(width, height)</code>参数是更改后图片的宽高<br>  <code>drawPixmap(30, 30, pix);</code>第三四参数省略的话，绘制的图片是原图大小</li>
</ul>
</li>
</ul>
<h2 id="7-2-自定义按钮类"><a href="#7-2-自定义按钮类" class="headerlink" title="7.2.自定义按钮类"></a>7.2.自定义按钮类</h2><ul>
<li>1.我们想要一个点击后会变化的按钮，这需要我们自己封装。首先变化就至少需要两个不同的图片，可在头文件里添加代码：  <figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">QString normalImgPath;  <span class="comment">//默认图片显示路径</span></span><br><span class="line">QString pressImgPath;   <span class="comment">//按下后显示图片的路径</span></span><br></pre></td></tr></table></figure>
  构造函数为：<code>MyPushButton(QString normalImg, QString pressImg);</code>,它继承QPushButton,且里面需要对图片加载进行判断：<code>bool ret = pix.load(this-&gt;normalImgPath);</code>,load()函数若加载失败会返回false。</li>
<li>2.设置按钮显示图片的格式 <code>setStyleSheet(&quot;QPushButton&#123;border:0px;&#125;&quot;);</code>，采用了html语法</li>
<li>3.给按钮设置图片 <code>setIcon(pix);</code>,参数是图片对象</li>
<li>4.设置按钮图片的大小 <code>setIconSize(QSize(wid, hei));</code>，需要将宽高转化成QSize对象</li>
<li>5.调节按钮位置 <code>move(x, y);</code>参数是相较于原点在x,y轴上移动的距离</li>
<li>6.zoom()实现按钮的动画特效<ul>
<li>1.动画对象初始化 <code>QPropertyAnimation * animation = new QPropertyAnimation(this, &quot;geometry&quot;);</code>,this是按钮</li>
<li>2.设置动画的时间间隔 <code>setDuration(200);</code>，参数的单位是ms</li>
<li>3.设置动画的开始和结束位置  <figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">animation-&gt;<span class="built_in">setStartValue</span>(<span class="built_in">QRect</span>(x, y, width, height));</span><br><span class="line">animation-&gt;<span class="built_in">setEndValue</span>(<span class="built_in">QRect</span>(x, y, width, height));</span><br></pre></td></tr></table></figure>
  QPropertyAnimation动画对象设置位置时的参数是一个矩形对象，矩形对象四个参数依次为：原点的x坐标，原点的y坐标，矩形的宽，矩形的高。</li>
<li>4.设置动画的过场曲线 <code>setEasingCurve(QEasingCurve::OutBounce);</code></li>
<li>5.开始动画 <code>start()</code></li>
</ul>
</li>
</ul>
<h2 id="7-3-选关场景"><a href="#7-3-选关场景" class="headerlink" title="7.3.选关场景"></a>7.3.选关场景</h2><p>点击开始按钮后，需要切换到第二个场景——选关场景，点击返回按钮后，需要返回到主场景。因此要在主场景中监听点击信号和返回信号，主场景监听到点击信号后隐藏自身，显示选关场景；监听到返回信号后隐藏选关场景，显示主场景。</p>
<figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">connect</span>(startBtn, &amp;MyPushButton::clicked, [=]()&#123;</span><br><span class="line">startBtn-&gt;<span class="built_in">zoom</span>();</span><br><span class="line"><span class="comment">//延时进入第二个场景</span></span><br><span class="line">QTimer::<span class="built_in">singleShot</span>(<span class="number">500</span>, <span class="keyword">this</span>, [=]()&#123;</span><br><span class="line">    <span class="comment">//将自身隐藏调用</span></span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">hide</span>();</span><br><span class="line">    <span class="comment">//创建第二个选择关卡的场景</span></span><br><span class="line">    chooseScene-&gt;<span class="built_in">show</span>();</span><br><span class="line">&#125;);</span><br><span class="line"><span class="built_in">connect</span>(chooseScene, &amp;ChooseLevelScene::chooseSceneBack, [=]()&#123;</span><br><span class="line">    chooseScene-&gt;<span class="built_in">hide</span>();</span><br><span class="line">    <span class="keyword">this</span>-&gt;<span class="built_in">show</span>();</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
<ul>
<li>1.定时器延时 <code>QTimer::singleShot(500, this, [=]()&#123;&#125;);</code>,第一参数是延时时间，第二参数是延时对象，延时后进行的操作可以使用Lambda表达式</li>
<li>2.开始和返回按钮的特效实现不一样，开始按钮是通过zoom()和点击信号实现图片浮动特效，而返回按钮通过鼠标点击和释放事件显示不同图片实现特效，且鼠标事件需要重写并实现。  <figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br></pre></td><td class="code"><pre><span class="line"><span class="function"><span class="type">void</span> <span class="title">MyPushButton::mousePressEvent</span><span class="params">(QMouseEvent * e)</span></span></span><br><span class="line"><span class="function"></span>&#123;</span><br><span class="line">    <span class="keyword">if</span>(<span class="keyword">this</span>-&gt;pressImgPath != <span class="string">&quot;&quot;</span>)</span><br><span class="line">    &#123;</span><br><span class="line">        QPixmap pix;</span><br><span class="line">        <span class="type">bool</span> ret = pix.<span class="built_in">load</span>(<span class="keyword">this</span>-&gt;pressImgPath);</span><br><span class="line">        <span class="keyword">if</span>(!ret)</span><br><span class="line">        &#123;</span><br><span class="line">            <span class="built_in">qDebug</span>()&lt;&lt;<span class="string">&quot;图片加载失败&quot;</span>;</span><br><span class="line">            <span class="keyword">return</span>;</span><br><span class="line">        &#125;</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setFixedSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>());</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setStyleSheet</span>(<span class="string">&quot;QPushButton&#123;border:0px;&#125;&quot;</span>);</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setIcon</span>(pix);</span><br><span class="line">        <span class="keyword">this</span>-&gt;<span class="built_in">setIconSize</span>(<span class="built_in">QSize</span>(pix.<span class="built_in">width</span>(), pix.<span class="built_in">height</span>()));</span><br><span class="line">    &#125;</span><br><span class="line">    <span class="comment">//其他事情，交给父类处理</span></span><br><span class="line">    QPushButton::<span class="built_in">mousePressEvent</span>(e);</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
  鼠标释放事件的实现与之相同，只是判断时的图片路径不同。注意所有事情做完后要将其他事情交给父类处理<code>QPushButton::mousePressEvent(e);</code>，<strong>如果重写后少了这句代码，所有的鼠标事件都将无效</strong>。</li>
<li>3.创建选关按钮  <figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">20</span>; ++i)&#123;</span><br><span class="line">    MyPushButton * menuBtn = <span class="keyword">new</span> <span class="built_in">MyPushButton</span>(<span class="string">&quot;:/res/img/LevelIcon.png&quot;</span>);</span><br><span class="line">    menuBtn-&gt;<span class="built_in">setParent</span>(<span class="keyword">this</span>);</span><br><span class="line">    menuBtn-&gt;<span class="built_in">move</span>(<span class="number">25</span> + (i % <span class="number">4</span>) * <span class="number">70</span>, <span class="number">130</span> + i /<span class="number">4</span> * <span class="number">70</span>);</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
  不必使用双重for循环，使用对行取余确定横向距离，对行取商确定纵向距离更高效。当然也要对这些按钮的点击进行监听，一旦点击将隐藏自身，进入游戏场景。</li>
<li>4.在选关按钮上显示文字<ul>
<li>1.使用标签显示文字 <code>QLabel * label = new QLabel(this);</code></li>
<li>2.设置标签大小 <code>setFixedSize(width, height)</code></li>
<li>3.设置标签显示内容 <code>setText(QString::number(i+1))</code></li>
<li>4.将标签文字显示在按钮上 <code>move(25 + (i % 4) * 70, 130 + i /4 * 70)</code></li>
<li>5.设置文字居中 <code>setAlignment(Qt::AlignCenter | Qt::AlignVCenter);</code></li>
<li>6.在按钮上覆盖了Label，因此要设置鼠标穿透 <code>setAttribute(Qt::WA_TransparentForMouseEvents);</code></li>
</ul>
</li>
</ul>
<h2 id="7-4-游戏场景"><a href="#7-4-游戏场景" class="headerlink" title="7.4.游戏场景"></a>7.4.游戏场景</h2><ul>
<li><p>1.金币类的封装<br>  类似按钮，但它封装更多的属性：</p>
  <figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line"><span class="type">int</span> posX;<span class="comment">//金币的x坐标</span></span><br><span class="line"><span class="type">int</span> posY;<span class="comment">//金币的y坐标</span></span><br><span class="line"><span class="type">bool</span> flag;<span class="comment">//true为正，false为反</span></span><br><span class="line">QTimer * timer1;    <span class="comment">//正面翻反面,定时器</span></span><br><span class="line">QTimer * timer2;    <span class="comment">//反面翻正面,定时器</span></span><br><span class="line"><span class="type">int</span> min=<span class="number">1</span>;            <span class="comment">//最小图片</span></span><br><span class="line"><span class="type">int</span> max=<span class="number">8</span>;            <span class="comment">//最大图片</span></span><br><span class="line"><span class="comment">//创建是否执行动画的标志</span></span><br><span class="line"><span class="type">bool</span> isAnimation;</span><br><span class="line"><span class="comment">//创建检测是否胜利的标志</span></span><br><span class="line"><span class="type">bool</span> isWin;</span><br></pre></td></tr></table></figure>
<p>  并且与自定义按钮类相同，需要重写鼠标按下事件<code>void mousePressEvent(QMouseEvent *);</code>，但不同的是它要定义一个翻转函数<code>void changeFlag();</code></p>
</li>
<li><p>2.游戏场景头文件的属性</p>
  <figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">//游戏二维数组，维护里面金币或银币标志</span></span><br><span class="line"><span class="type">int</span> gameArr[<span class="number">4</span>][<span class="number">5</span>];</span><br><span class="line"><span class="comment">//创建一个成员变量，记录当前关卡的关卡号</span></span><br><span class="line"><span class="type">int</span> levelIndex;</span><br><span class="line"><span class="comment">//创建金币按钮数组</span></span><br><span class="line">MyCoin * coinBtn[<span class="number">4</span>][<span class="number">5</span>];</span><br><span class="line"><span class="comment">//是否胜利的标志</span></span><br><span class="line"><span class="type">bool</span> isWin;</span><br></pre></td></tr></table></figure>
</li>
<li><p>3.游戏关卡的引入<br>  借助dataConfig关卡配置类里定义的二维动态数组:<code>QMap&lt;int, QVector&lt;QVector&lt;int&gt; &gt; &gt; mData;</code>显示金币排列，0为银币，1为金币。实现为<code>QVector&lt;QVector&lt;int&gt; &gt; v;</code>,利用二重循环将arr中的数据导入v中，接着插入mData中：<code>mData.insert(1, v);</code>，1是关数，下次插入时要清除v中数据<code>v.clear()</code><br>  游戏场景与关卡配置文件同步：</p>
  <figure class="highlight cpp"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">dataConfig data;</span><br><span class="line"><span class="comment">//初始化游戏中的二维数组</span></span><br><span class="line"><span class="keyword">for</span>(<span class="type">int</span> i=<span class="number">0</span>; i&lt;<span class="number">4</span>; ++i)&#123;</span><br><span class="line">    <span class="keyword">for</span>(<span class="type">int</span> j=<span class="number">0</span>; j&lt;<span class="number">5</span>; ++j)&#123;</span><br><span class="line">        <span class="keyword">this</span>-&gt;gameArr[i][j] = data.mData[<span class="keyword">this</span>-&gt;levelIndex][i][j];</span><br><span class="line">    &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure></li>
<li><p>4.创建金币<br>  在游戏场景借助维护金币银币标志的二维数组gameArr[][]来判断显示的硬币图片，0银币，1金币。还要对硬币的坐标属性，翻转标志进行初始化。</p>
</li>
<li><p>5.金币翻转实现<br>  在硬币类的构造函数里初始化两种翻转的定时器，并监听重写函数changeFlag()发来的定时器超时信号，一旦超时，变化显示的图片实现硬币翻转。</p>
</li>
<li><p>6.翻转周围硬币<br>  借助游戏场景的二维数组gameArr[][]记录周围的硬币状态，但调用changeFlag()需要是硬币自身，而二重循环后硬币被销毁找不到，所以需要游戏场景的<code>MyCoin * coinBtn[4][5];</code>二维数组记录所有按钮，硬币一旦创建就将它放入coinBtn[][]中，而gameArr[][]在选择关卡时就已经初始化。只需要简单的边界判断，翻硬币时coinBtn[][]调用changeFlag()，gameArr[][]自身取反即可。</p>
</li>
</ul>
<h2 id="7-5-检测游戏胜利"><a href="#7-5-检测游戏胜利" class="headerlink" title="7.5.检测游戏胜利"></a>7.5.检测游戏胜利</h2><ul>
<li>1.检测胜利<br>二重循环检测coinBtn[][]-&gt;flag()是否有false，若有则没有胜利。</li>
<li>2.胜利后的操作<br>游戏胜利后硬币是不允许再次翻转的，对游戏场景的isWin进行判断，若为true，则将全部硬币按钮的isWin设为true,配合重写的鼠标事件即可禁用点击。</li>
</ul>
<blockquote>
<p>1.窗口、按钮、标签都能设置其图片大小。<br>2.三个场景都需要重写绘图事件，以显示背景图片；都需要设置窗口大小、标题、图标。<br>3.能够点击的按钮，开始、返回、选关、硬币都需要重写鼠标点击事件。<br>4.窗口间的切换需要发送信号和进行监听，即将显示的窗口发送信号，所有窗口都在监听。切换场景之前可以通过<code>setGeometry()</code>函数同步两个场景的位置。</p>
</blockquote>
<hr>

        
            <div class="donate-container">
    <div class="donate-button">
        <button id="donate-button">赞赏</button>
    </div>
    <div class="donate-img-container hide" id="donate-img-container">
        <img id="donate-img" src="" data-src="/myblog/img/donate.jpg">
        <p> 感谢鼓励 </p>
    </div>
</div>
        
        <br />
        <div id="comment-container">
        </div>
        <div id="disqus_thread"></div>
        <div id="lv-container"></div>
        <div class="giscus"></div>
    </div>
</div>

    </div>
</div>


<footer class="footer">
    <ul class="list-inline text-center">
        
        

        

        

        
        <li>
            <a target="_blank"  href="https://github.com/samuel-24276">
                            <span class="fa-stack fa-lg">
                                <i class="iconfont icon-github"></i>
                            </span>
            </a>
        </li>
        

        

    </ul>
    
    <p>
        <span>/</span>
        
        <span><a target="_blank" rel="noopener" href="https://github.com/samuel-24276">samuel-24276&#39;s Page</a></span>
        <span>/</span>
        
        <span><a target="_blank" rel="noopener" href="https://beian.miit.gov.cn/">北京-未备案</a></span>
        <span>/</span>
        
        <span><a href="#">返回顶部</a></span>
        <span>/</span>
        
    </p>
    
    <p>
        <span id="busuanzi_container_site_pv">
            <span id="busuanzi_value_site_pv"></span>PV
        </span>
        <span id="busuanzi_container_site_uv">
            <span id="busuanzi_value_site_uv"></span>UV
        </span>
        Created By <a target="_blank" rel="noopener" href="https://hexo.io/">Hexo</a>  Theme <a target="_blank" rel="noopener" href="https://github.com/aircloud/hexo-theme-aircloud">AirCloud</a></p>
</footer>




</body>

<script>
    // We expose some of the variables needed by the front end
    window.hexo_search_path = "search.json"
    window.hexo_root = "/myblog/"
    window.isPost = true
</script>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>

<script src="/myblog/js/index.js"></script>

<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>






    <script type="text/javascript">
       (function() {
           if (typeof LivereTower === 'function') { return; }

           var j, d = document.getElementById('lv-container');

           d.setAttribute('data-id','city');
           d.setAttribute('data-uid' , 'MTAyMC80OTA5OC8yNTU5Mw==');

           j = document.createElement('script');
           j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
           j.async = true;

           d.appendChild(j);
       })();
    </script>
    <noscript>为正常使用来必力评论功能请激活JavaScript</noscript>
    </div>

</html>
